.dropItem {
  width: 100%;
  height: 100%;
}
.dragDropItem{
  position: relative;
  padding: 8px 16px;
}
.isOver{
  position: relative;
  &:after{
    content: ' ';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(4, 84, 242, 0.16);
  }
}
.isTopOver {
  background-color: rgba(239, 246, 255);
  &:after {
    position: absolute;
    content: '';
    display: block;
    width: 100%;
    height: 4px;
    top: -10px !important;
    left: 0 !important;
    bottom: unset !important;
    right: unset !important;
    background-color: #0454f2;
    z-index: 1;
  }
}

.isBottomOver {
  background-color: rgba(239, 246, 255);
  &:after {
    position: absolute;
    content: '';
    display: block;
    width: 100%;
    height: 4px;
    bottom: -10px !important;
    left: 0 !important;
    top: unset !important;
    right: unset !important;
    background-color:#0454f2;
    z-index: 1;
  }
}

.isLeftOver {
  background-color: rgba(239, 246, 255);
  &:after {
    position: absolute;
    content: '';
    display: block;
    width: 4px;
    height: 100%;
    top: 0 !important;
    left: 0 !important;
    bottom: unset !important;
    right: unset !important;
    background-color: #0454f2;
    z-index: 1;
  }
}
.isRightOver {
  background-color: rgba(239, 246, 255);
  &:after {
    position: absolute;
    content: '';
    display: block;
    width: 4px;
    height: 100%;
    top: 0 !important;
    bottom: unset !important;
    left: unset !important;
    right: 0 !important;
    background-color: #0454f2;
    z-index: 1;
  }
}